<style scoped>
	.com_side{
		position: fixed;
		left:0;
		top:60px;
		width:200px;
		height:100%;
		padding-top:20px;
		background:#fff;
		z-index:101;
		border-right:solid 1px #f1f1f1;
	}
	.com_side .list{
		overflow-y: auto;
	}
	.com_side .item{
		width:100%;
		height:50px;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: left;
		padding-left:30px;
		position: relative;
		color:#777;
	}
	.com_side .item:after{
		content:'';
		display:block;
		position: absolute;
		left:0;
		top:0;
		width:5px;
		height:50px;
		background:#8776f7;
		display:none;
	}
	.com_side .iconfont{
		font-size:22px;
	}
	.com_side .title{
		font-size:14px;
		margin-left:20px;
	}
	.com_side .active{
		color:#8776f7;
	}
	.com_side .active:after{
		display:block;
	}
	@media (max-width: 768px) {
		.com_side{
			display:none;
    	}
	}
</style>
<div class="com_side">
	<div class="list" id="side-main-nav">
		<a href="/wx/home"><li class="item" data-mark="home">
			<span class="iconfont">&#xe625;</span>
			<span class="title">数据分析</span>
		</li></a>
		<a href="/wx/top"><li class="item" data-mark="top">
				<span class="iconfont">&#xe608;</span>
				<span class="title">TOP分析</span>
		</li></a>
		<a href="/wx/pagesavg"><li class="item" data-mark="pages">
			<span class="iconfont">&#xe6ea;</span>
			<span class="title">访问页面</span>
		</li></a>
		<a href="/wx/ajaxavg"><li class="item" data-mark="ajax">
			<span class="iconfont">&#xe653;</span>
			<span class="title">AJAX性能</span>
		</li></a>
		<a href="/wx/erroravg"><li class="item" data-mark="error">
			<span class="iconfont">&#xe627;</span>
			<span class="title">脚本错误</span>
		</li></a>
		<a href="/wx/analysislist"><li class="item" data-mark="analysis">
			<span class="iconfont">&#xe65d;</span>
			<span class="title">用户轨迹</span>
		</li></a>
		<a href="/wx/diagram"><li class="item" data-mark="diagram">
			<span class="iconfont">&#xe79c;</span>
			<span class="title">流量热力图</span>
		</li></a>
		<a href="/wx/setting"><li class="item" data-mark="setting">
			<span class="iconfont">&#xe660;</span>
			<span class="title">系统设置</span>
		</li></a>
	</div>
</div>
<script>
	var href = location.href;
	var liobjs = $('#side-main-nav').find('li')
	for (var i = 0, len = liobjs.length; i < len; i++) {
		var attrr = $(liobjs[i]).attr('data-mark')
		if (href.indexOf(attrr) != -1) {
			liobjs.removeClass('active')
			$(liobjs[i]).addClass('active')
		}
	}
</script>